<template>
    <div>
        <nav-header>
            <template v-slot:title>提现信息</template>
        </nav-header>

        <div style="background-color: #fff;text-align: center;font-size: 20px;font-weight: bold;color: #a25f32;padding: 10px;margin-top: 20px;">可提现金额:￥{{balance}}</div>

        <div style="background-color: #fff;margin-top: 20px;padding: 20px 40px;">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-xs-8">
                        <input type="number" style="width: 100%;outline: none;border: none;" v-model="form.cash_number" placeholder="请输入提现金额">
                    </div>
                    <div class="col-xs-4" style="text-align: right;">
                        <a @click="allin()" href="javascript:;" style="color: #000;">全部提现</a>
                    </div>
                </div>
            </div>
        </div>

        <div style="background-color: #fff;margin-top: 20px;padding: 20px 40px;">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-xs-8">
                        <input style="width: 100%;outline: none;border: none;" v-model="form.username" placeholder="请输入提现姓名">
                    </div>
                </div>
            </div>
        </div>

        <div style="background-color: #fff;margin-top: 20px;padding: 20px 40px;">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-xs-8">
                        <input type="number" style="width: 100%;outline: none;border: none;" v-model="form.mobile_number" placeholder="请输入提现电话">
                    </div>
                </div>
            </div>
        </div>


        <div style="background-color: #fff;margin-top: 20px;padding: 20px 40px;">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-xs-8">
                        <input style="width: 100%;outline: none;border: none;" v-model="form.ali_account" placeholder="请输入提现支付宝">
                    </div>
                </div>
            </div>
        </div>

        <div @click="postWithdraw" style="color: #fff;background-color: #d27a3f;padding: 15px;text-align: center;margin-top: 40px;">
            立即提现
        </div>

    </div>
</template>
<script>
    import NavHeader from "../Layout/NavHeader";
    import swal from "sweetalert";

    export default {
        components: {NavHeader},

        data() {
            return {
                balance: 0.00,
                form: {
                    cash_number: '',
                    username: '',
                    mobile_number: '',
                    ali_account: '',
                }
            }
        },
        created() {
        },
        mounted() {
            this.getUserInfo();
        },
        methods: {
            allin() {
                this.form.cash_number = this.balance;
            },
            getUserInfo() {
                let that = this;
                this.api.center().then(res => {
                    if (res) {
                        that.balance = res.data.balance;
                    }
                });
            },
            postWithdraw() {
                if (this.form.cash_number == undefined || !this.form.cash_number || this.form.cash_number == 0) {
                    swal("请填写提现余额");
                    return;
                }

                if (this.balance >= this.form.cash_number) {
                    this.api.postWithdraw(this.form).then(res => {
                        if (res.meta.code == '000') {
                            swal("提交成功!请等待审核").then((value) => {
                                window.location.reload();
                            });
                        }
                    })
                } else {
                    swal("提现余额不足");
                }

            }
        },
    }
</script>
<style scoped>


</style>
